<html>
<head>
<title>JavaScript OT</title>
<script src="../../common.pbjson.js" type="text/javascript"></script>
<script src="../../jsot.js" type="text/javascript"></script>
</head>
<body>
	<h1>Hello world</h1>
	<pre id="out"></pre>
	<script type="text/javascript">
var doc = new JSOT.Doc();

var ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newCharacters("Hallo!") );

ops.applyTo(doc);

var result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

var ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newAnnotationBoundary( [], [ protocol.ProtocolDocumentOperation.newKeyValueUpdate( "bold", null, "true" ) ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(5) );
ops.component.push( protocol.ProtocolDocumentOperation.newAnnotationBoundary( [ "bold" ], [ ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newCharacters(" ") );
ops.component.push( protocol.ProtocolDocumentOperation.newElementStart("b") );
ops.component.push( protocol.ProtocolDocumentOperation.newAnnotationBoundary( [], [ protocol.ProtocolDocumentOperation.newKeyValueUpdate( "italic", null, "true" ) ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newCharacters("Welt") );
ops.component.push( protocol.ProtocolDocumentOperation.newAnnotationBoundary( [ "italic" ], [ ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newElementEnd() );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(1) );
ops.component.push( protocol.ProtocolDocumentOperation.newCharacters(" Bye.") );

ops.applyTo(doc);

var result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(6) );
ops.component.push( protocol.ProtocolDocumentOperation.newReplaceAttributes( [ ], [ protocol.ProtocolDocumentOperation.newKeyValuePair( "foo", "bar"), protocol.ProtocolDocumentOperation.newKeyValuePair("remove", "me") ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(11) );

ops.applyTo(doc);

result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(6) );
ops.component.push( protocol.ProtocolDocumentOperation.newUpdateAttributes( [ protocol.ProtocolDocumentOperation.newKeyValueUpdate( "foo", "bar", "bar2" ), protocol.ProtocolDocumentOperation.newKeyValueUpdate( "remove", "me", null ) ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(11) );

ops.applyTo(doc);

result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(6) );
ops.component.push( protocol.ProtocolDocumentOperation.newReplaceAttributes( [ protocol.ProtocolDocumentOperation.newKeyValuePair( "foo", "bar2" ) ], [ protocol.ProtocolDocumentOperation.newKeyValuePair( "xfoo", "Xbar"), protocol.ProtocolDocumentOperation.newKeyValuePair( "name", "Joe" ) ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(11) );

ops.applyTo(doc);

result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(2) );
ops.component.push( protocol.ProtocolDocumentOperation.newDeleteCharacters("ll") );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(2) );
ops.component.push( protocol.ProtocolDocumentOperation.newDeleteElementStart("b", [ protocol.ProtocolDocumentOperation.newKeyValuePair( "xfoo", "Xbar"), protocol.ProtocolDocumentOperation.newKeyValuePair("name", "Joe" ) ] ) );
ops.component.push( protocol.ProtocolDocumentOperation.newDeleteCharacters("Welt") );
ops.component.push( protocol.ProtocolDocumentOperation.newDeleteElementEnd("b") );
ops.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(6) );

ops.applyTo(doc);

result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(result + "\n\n") );

ops = new protocol.ProtocolDocumentOperation();
ops.component.push( protocol.ProtocolDocumentOperation.newDeleteCharacters("Hao ! Bye.") );

ops.applyTo(doc);

result = doc.toString();
document.getElementById("out").appendChild( document.createTextNode(">>" + result + "<<") );

document.getElementById("out").appendChild( document.createTextNode( doc.content.length.toString() ) );

var url = new JSOT.WaveUrl( "wave://wave1.vs.uni-due.de/foo$w+abc/conv+root" );
document.getElementById("out").appendChild( document.createTextNode( url.toString() ) );


ops1 = new protocol.ProtocolDocumentOperation();
ops1.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(2) );
ops1.component.push( protocol.ProtocolDocumentOperation.newDeleteCharacters("12") );

ops2 = new protocol.ProtocolDocumentOperation();
ops2.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(1) );
ops2.component.push( protocol.ProtocolDocumentOperation.newDeleteCharacters("b") );
ops2.component.push( protocol.ProtocolDocumentOperation.newRetainItemCount(2) );

protocol.ProtocolDocumentOperation.xform( ops1, ops2 );
console.log(ops1);
console.log(ops2);
	</script>
</body>
</html>